<template>
  <div class="box">
    <div class="wai">
      <div class="logo">尸体录入</div>
      <div class="nei">
        <el-form
          :model="ruleForm"
          :rules="rules"
          ref="ruleForm"
          label-width="100px"
          class="demo-ruleForm"
        >
          <el-form-item label="学科" prop="subjectName">
            <el-select
              style="width: 41%"
              v-model="ruleForm.subjectName"
              placeholder="请选择活动学科"
            >
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="目录" prop="catalogID">
            <el-select
              style="width: 41%"
              v-model="ruleForm.catalogID"
              placeholder="请选择目录"
            >
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="企业" prop="enterpriseID">
            <el-select
              style="width: 41%"
              v-model="ruleForm.enterpriseID"
              placeholder="请选择企业"
            >
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <!-- <el-form-item label="城市" prop="city">
            <el-select
              style="width: 20%"
              v-model="city"
              multiple
              placeholder="请选择"
            >
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
            <el-select
              v-model="value2"
              multiple
              collapse-tags
              style="margin-left: 10px; width: 20%"
              placeholder="请选择"
            >
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item> -->
          <el-form-item label="方向" prop="direction">
            <el-select
              style="width: 41%"
              v-model="ruleForm.direction"
              placeholder="请选择方向"
            >
              <el-option label="区域一" value="shanghai"></el-option>
              <el-option label="区域二" value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="题型" prop="questionType">
            <el-radio-group v-model="ruleForm.questionType">
              <el-radio label="单选"></el-radio>
              <el-radio label="多选"></el-radio>
              <el-radio label="简答"></el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="难度" prop="difficulty">
            <el-radio-group v-model="ruleForm.difficulty">
              <el-radio label="简单"></el-radio>
              <el-radio label="一般"></el-radio>
              <el-radio label="困难"></el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="题干" prop="question">
            <Editor></Editor>
          </el-form-item>
          <!-- <el-form-item label="选项" prop="options">
            <el-radio-group class="xuan" v-model="options[0]">
              <el-radio :label="3"
                >A:<el-input v-model="input"></el-input
              ></el-radio>
              <el-upload
                class="upload-demo"
                action="https://jsonplaceholder.typicode.com/posts/"
                :on-change="handleChange"
                :file-list="fileList"
              >
                <el-button size="small" type="primary">上传图片</el-button>
              </el-upload>
            </el-radio-group>
            <el-radio-group class="xuan" v-model="radio">
              <el-radio :label="3"
                >B:<el-input v-model="input"></el-input
              ></el-radio>
              <el-upload
                class="upload-demo"
                action="https://jsonplaceholder.typicode.com/posts/"
                :on-change="handleChange"
                :file-list="fileList"
              >
                <el-button size="small" type="primary">上传图片</el-button>
              </el-upload>
            </el-radio-group>
            <el-radio-group class="xuan" v-model="radio">
              <el-radio :label="3"
                >C:<el-input v-model="input"></el-input
              ></el-radio>
              <el-upload
                class="upload-demo"
                action="https://jsonplaceholder.typicode.com/posts/"
                :on-change="handleChange"
                :file-list="fileList"
              >
                <el-button size="small" type="primary">上传图片</el-button>
              </el-upload>
            </el-radio-group>
            <el-radio-group class="xuan" v-model="radio">
              <el-radio :label="3"
                >D:<el-input v-model="input"></el-input
              ></el-radio>
              <el-upload
                class="upload-demo"
                action="https://jsonplaceholder.typicode.com/posts/"
                :on-change="handleChange"
                :file-list="fileList"
              >
                <el-button size="small" type="primary">上传图片</el-button>
              </el-upload>
            </el-radio-group>
            <el-row>
              <el-button class="daan" icon="el-icon-plus" type="danger" disabled
                >增加选项与答案</el-button
              >
            </el-row>
          </el-form-item> -->
          <!-- <el-form-item label="解析视频" prop="desc">
            <el-input style="width: 50%" v-model="input"></el-input>
          </el-form-item> -->
          <!-- <el-form-item label="答案解析" prop="desc">
            <Editor></Editor>
          </el-form-item> -->
          <!-- <el-form-item label="题目备注" prop="desc">
            <el-input
              style="width: 50%"
              type="textarea"
              v-model="ruleForm.desc"
            ></el-input>
          </el-form-item> -->
          <!-- <el-form-item label="尸体标签" prop="desc">
            <el-select
              style="width: 50%"
              v-model="value"
              placeholder="请选择尸体标签"
            >
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item> -->
          <el-form-item>
            <el-button class="tijiao" type="primary">确认提交</el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>

<script setup>
import Editor from "./component/index.vue";
import { getquestionsDetail } from "../../../../api/question";
export default {
  async created() {
    console.log(this.$route.query.id);
    const res = await this.getquestionsDetail(this.$route.query.id);
    console.log(res, "shitishitishitishiti");
    this.ruleForm = res;
  },
  components: {
    Editor,
  },
  data() {
    return {
      ruleForm: {
        subjectName: "",
        region: "",
        date1: "",
        date2: "",
        delivery: false,
        type: [],
        resource: "",
        desc: "",
      },
      content: null,
      deitorOption: {},
      input: "",
    };
  },
  methods: {
    async getquestionsDetail(id) {
      const res = await getquestionsDetail(id);
      return res;
    },
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          alert("submit!");
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
  },
};
</script>

<style lang="scss" scoped>
.tijiao {
  margin-bottom: 40px;
}
.daan {
  margin-top: 30px;
}
.upload-demo {
  margin-left: 10px;
}
.xuan {
  display: flex;
}
.nei {
  padding-left: 50px;
}
.logo {
  border-bottom: 1px solid #e5e9f2;
  padding-left: 15px;
  padding-bottom: 15px;
  margin-bottom: 15px;
}
.box {
  background: #e5e9f2;
  padding-top: 5px;
  padding-bottom: 200px;
}
.wai {
  background-color: #fff;
  margin-top: 20px;
  padding-top: 20px;
  margin-left: 10px;
  margin-right: 10px;
}
</style>